<template>
    <div class="ground-con">
        <div class="ground-layer_title">
            <span>地表透明</span>
        </div>
        <div class="ground_close" @click="doCloseGroundPopup"></div>
        <div class="ground-form-con">
          <el-slider label="地面透明" v-model="groundTransValue" show-input  @change="changeTransValue($event)"></el-slider>
          <el-slider label="地面高度" v-model="groundHeight" show-input  @change="changeHeightValue($event)"></el-slider>
        </div>
      
    </div>
  </template>
  
  <script>
  export default {
    name: "MarkerPopup",
  
    data() {
      return {
        selectShow: false,
        groundTransValue: 0,
        groundHeight: 0,
        
      };
    },
  
    mounted() {},
  
    methods: {
      changeTransValue(value) {
        console.log('==changeTransValue===',value)
      },
      changeHeightValue(value) {
        console.log('==changeHeightValue===',value)
      },
      doCloseGroundPopup() {
        this.$parent.doSetIsShowPopup();
      }
    
    },
  };
  </script>
  
  <style lang="scss" scoped>
    .ground-con {
        // width: 301px;
        // color: #ffffff;
        // background: url("../assets/panelTree/dtml_bg.png") no-repeat;
        // background-size: 100% 100%;
    }

    .ground-layer_title{
      width: 280px;
      height: 35px;
      box-sizing: border-box;
      background: url("@/assets/panelTree/dtml_bg_title.png") no-repeat;
      font-family: SourceHanSansCN-Regular;
      font-size: 18px;
      background-size: 100% 100%;
      text-align: left;
      padding-left: 50px;
      line-height: 40px;
      // background-color: red;
      margin: 10px 0 0 10px;
    }

    .ground-layer_title span {
        font-family: SourceHanSansCN-Regular;
        font-size: 18px;
        color: #c8e9ff;
    }

    .ground_close {
        width: 14px;
        height: 15px;
        background: url('@/assets/poipopup/poi_popup_close.png');
        position: relative;
        top: -26px;
        left: 264px;
        cursor: pointer;
    }

    .ground-form-con {
      width: 90%;
      // background-color: red;
      margin: 0 auto;
    }
    ::v-deep{
      .el-slider__bar{
        background-color: rgba(66, 171, 225, 0.9);
      }
    }
  </style>
  